<div ng-controller="registerCtrl">
    <div class="space-80"></div>
    <div class="col-sm-6 col-sm-offset-3">
        <form role="form" name="registerForm" method="post" class="reservation-form form-horizontal" id="reservation-form" ng-submit="submitForm(registerForm.$valid)" novalidate>
            <div class="row">
                <div class="login-register-inner">
                    <h3 class="margin-b-20 text-uppercase">注册</h3>
                    <form>
                        <!-- 用户名 -->
                        <p class="error colorRed" ng-if="registerForm.name.$error.required && registerForm.name.$touched">请输入用户名</p>
                        <div class="input-group">
                            <div class="input-group-addon">
                                <span class="glyphicon glyphicon-user"></span>
                            </div>
                            <input type="text" class="form-control" placeholder="用户名" id="name" name="name" required ng-model='user.name' required/>
                             <!-- $dirty:表单有填写记录, $valid:字段内容合法的-->
                            <span class="glyphicon glyphicon-ok form-control-feedback colorGreen" ng-show="registerForm.name.$dirty && registerForm.name.$valid"></span>
                              <!-- $invalid:字段内容是非法的, $pristine:表单没有填写记录-->
                        </div>
                        <!-- 手机号 -->
                        <p class="error colorRed" ng-if="registerForm.phone.$error.required && registerForm.phone.$touched">请输入手机号</p>
                        <div class="input-group">
                            <div class="input-group-addon">
                                <span class="glyphicon glyphicon-phone"></span>
                            </div>
                            <input type="tel" class="form-control" placeholder="手机号" id="phone" name="phone" required ng-model='user.phone'> 
                            <span class="glyphicon glyphicon-ok form-control-feedback colorGreen" ng-show="registerForm.phone.$dirty && registerForm.phone.$valid"></span>
                        </div>
                        <!-- 密码 -->
                        <p class="error colorRed" ng-if="registerForm.password.$error.required && registerForm.password.$touched">请输入密码</p>
                        <p class="colorRed">
                            <span ng-show="registerForm.password.$invalid">
                                <span ng-show="registerForm.password.$error.minlength">密码长度不小于6</span>
                                <span ng-show="registerForm.password.$error.maxlength">密码长度不超过20</span>
                            </span>
                        </p>
                        <div class="input-group">
                            <div class="input-group-addon">
                                <span class="glyphicon glyphicon-lock"></span>
                            </div> 
                            <input type="password" class="form-control" placeholder="密码（6-20位）" id="password" name="password" ng-minlength="6" ng-maxlength="20" ng-model='user.password' required/>
                            <span class="glyphicon glyphicon-ok form-control-feedback colorGreen" ng-show="registerForm.password.$dirty && registerForm.password.$valid"></span>
                        </div>
                        <!-- 确认密码 -->
                        <p class="error colorRed" ng-if="registerForm.passwordagain.$error.required && registerForm.passwordagain.$touched">请再次输入密码</p>
                        <p class="colorRed" ng-if="registerForm.passwordagain.$dirty && user.passwordagain!=user.password">两次密码输入不一致</p>
                        <div class="input-group">
                            <div class="input-group-addon">
                                <span class="glyphicon glyphicon-lock"></span>
                            </div>
                            <input type="password" class="form-control" placeholder="确认密码（6-20位）" id="passwordagain" name="passwordagain" ng-minlength="6"
                    ng-maxlength="20" ng-model='user.passwordagain' compare="user.password" required/>
                            <span class="glyphicon glyphicon-ok form-control-feedback colorGreen" ng-show="registerForm.passwordagain.$dirty && registerForm.passwordagain.$valid && user.passwordagain == user.password"></span>
                        </div>
                        <!-- 提交 -->
                        <div class="clearfix">
                            <div class="pull-right text-right">
                                <input ui-sref="app.orderCash" type="submit" class="btn btn-primary btn-lg" value="注册">
                                <!-- <input type="submit" class="btn btn-primary btn-lg" value="注册"> -->
                                <!-- <input ui-sref="app.orderCash" type="submit" class="btn btn-dark btn-lg" value="注册"> -->
                            </div>
                            <div class="pull-left">
                                <div>
                                    <input type="checkbox" name="agree" id="agree">
                                    <label for="agree">同意相关条款</label>
                                </div>
                            </div>                                                                    
                        </div>
                    </form>
                </div> 
            </div>
        </form>   
    </div>
    
</div>    


    
          